<template>
    <div class="face-box">
        <ghUploadImage
            ref="ghUpload"
            v-if="uploadStatus"
            :system="system"
            :type="type"
            :businessType="businessType"
            :isCameraOnly="isCameraOnly"
            :pmdCamera="pmdCamera"
            :uploadOss="uploadOss"
            :imageAttribute="imageAttribute"
            @success="success"
            @state-change="stateChange"
        >
            <slot></slot>
        </ghUploadImage>
        <div v-else @click="recognition()">
            <slot></slot>
        </div>
    </div>
</template>

<script>
import {Toast} from 'mand-mobile'
import http from '@/utils/http'
import ghUploadImage from '@/components/ghUploadImage'
export default {
    name: 'face-recognition',
    components: {
        [Toast.name]: Toast,
        ghUploadImage
    },
    props: {
        // 系统类型
        system: {
            type: String
        },
        // 平台类型
        type: {
            type: String
        },
        // 业务类型
        businessType: {
            type: String
        },
        // 业务号
        businessNo: {
            type: String
        },
        // 身份信息加密串
        userData: {
            type: String
        },
        // 是否只打开相机
        isCameraOnly: {
            type: Boolean,
            default() {
                return true
            }
        },
        // 是否使用原生相机
        pmdCamera: {
            type: Boolean,
            default() {
                return true
            }
        },
        // 同步时，是否使用oss上传
        uploadOss: {
            type: Boolean,
            default() {
                return true
            }
        },
        // 图片压缩属性
        imageAttribute: {
            type: Object,
            default() {
                return {
                    quality: 0.5
                }
            }
        }
    },
    computed: {
    },
    data() {
        return {
            uploadStatus: false, // 是否触发同步人脸识别
            faceToken: '', // 人脸识别的关联TOKEN
            faceCheckUrl: '', // 异步链接
            other: '', // 其他信息
        }
    },
    mounted() {
    },
    methods: {
        // 人脸识别初始化
        init() {
            let _this = this
            _this.$nextTick(() => {
                let data = {
                    system: _this.system, // 系统类型
                    type: _this.type, // 平台类型
                    businessType: _this.businessType, // 业务类型
                    userData: _this.userData, // 姓名+身份证号+时间戳
                    businessNo: _this.businessNo, // 业务号
                }
                http.post(`${process.env.VUE_APP_BASIS_URL}/faceCheck/init`,{
                    data: data
                }).then(res => {
                    console.log(res, '人脸识别初始化')
                    _this.$emit('initBack', {code: res.resultCode, other: res.other})
                    if(res.resultCode == '0') {
                        if(res.verifyType == '0') { // 同步
                            _this.uploadStatus = true
                            _this.faceToken = res.faceToken
                        } else if(res.verifyType == '1') { // 异步
                            _this.uploadStatus = false
                            _this.faceCheckUrl = res.faceCheckUrl
                            _this.other = res.other
                        }
                    } 
                })
            })
        },
        // 异步回调
        recognition() {
            if(this.faceCheckUrl) {
                this.$emit('asyncBack', {faceCheckUrl: this.faceCheckUrl, other: this.other})
            } else {

            }
        },
        // 图片上传成功后人脸识别
        success(data) {
            console.log(data, '图片上传成功后人脸识别')
            this.faceAuth(data)
        },
        // 图片上传操作状态
        stateChange(data) {
            if(data.type == 'Loading') {
                this.operationStatus(2)
            }
            if(data.type == 'Error'){
                this.operationStatus(3)
            } 
            if(data.type == 'Complete') {
                Toast.hide()
            }
        },
        // 人脸识别操作状态
        operationStatus(code,num,message,fileUrl,fileId,other) {
            let data = [
                {code: num, message: message, imageUrl: fileUrl, fileId: fileId, other: other},
                {code: '5', message: '开始人脸识别'},
                {code: '6', message: '图片上传中'},
                {code: '7', message: '文件处理失败'}
            ]
            this.$emit('faceChange', data[code])
        },
        // 人脸识别验证
        faceAuth(val) {
            let _this = this
            this.$nextTick(() => {
                let data = {
                    system: _this.system, // 系统类型
                    type: _this.type, // 平台类型
                    faceToken: _this.faceToken, // 人脸识别Token
                    fileId: val.fileId, // 图片上传ID
                }
                console.log(data, '人脸识别验证入参')
                _this.operationStatus(1)
                http.post(`${process.env.VUE_APP_BASIS_URL}/face/auth`,{
                    data: data
                }).then(res => {
                    _this.$refs.ghUpload.previewFile(val.fileId).then(fileUrl => {
                        if(res.resultCode == '0') { // 成功
                            _this.$emit('syncBack',{faceToken: res.faceToken, imageUrl: fileUrl, fileId: val.fileId, other: res.other})
                        } else {
                            _this.operationStatus(0, res.resultCode, res.resultMessage, fileUrl, val.fileId, res.other)
                        }
                    }).catch(error => {
                        Toast.info('获取文件失败')
                    })
                })
            })
        },
    }
}
</script>

<style lang="less" scoped>
.face-box {
    display: inline-block;
    width: 100%;
    /deep/ .gh-upload-image {
        width: 100%;
    }
}
</style>